<script lang="ts" setup>
import { PageConfigType, PageInfoType } from "#/antd-vue";
import { getPostsApi } from "@/api";
import APublicPagination from "@/components/antd/APublicPagination.vue";
import { reactive } from "vue";

const pageInfo = reactive<PageInfoType>({
	current: 1,
	pageSize: 10,
	total: 100,
});

const pageConfig: PageConfigType = {
	showQuickJumper: true,
	showSizeChanger: true,
	pageSizeOptions: ["10", "20", "30", "40"],
	change(current, pageSize) {
		console.log(current, pageSize, "change");
	},
	showSizeChange(current, pageSize) {
		console.log(current, pageSize, "showSizeChange");
	},
};

getPostsApi().then((res) => {
	console.log("res=>   ", res);
	// pageInfo.total = res.total;
});
</script>

<template>
	<APublicPagination :pageInfo="pageInfo" :pageConfig="pageConfig" />
</template>
